/**
 * Created by Json on 2014/12/31.
 */
(function () {
    window.fp = fp || {};
	fp.setting = {};

	function element( tag, property, parent ) {
		var el = document.createElement( tag );
		var key;
		for ( key in property ) {
			switch ( key ) {
				case "css":
					var cssname;
					for ( cssname in property[key] ) {
						el.style.setProperty( cssname, property[key][cssname], null );
					}
					break;
				default:
					el[key] = property[key];
			}
		}
		parent.appendChild( el );
		return el;
	}

	fp.setting.open = function (obj) {
		var mask = element( "div", {
			"className" : "personal-setting-mask"
		}, document.body );
		var box = element( "div", {
			"className" : "personal-setting-box-border"
		}, document.body );
		var header = element( "div", {
			"className" : "personal-setting-box-header",
			innerHTML : "个人设置"
		}, box );
		var closeButton = element( "div", {
			"className" : "personal-setting-box-close-btn"
		}, header );
		var line1 = element( "div", {
			"className" : "personal-setting-box-line"
		}, box );
		var word1 = element( "div", {
			"className" : "personal-setting-box-word",
			innerHTML : "用户分享头像"
		}, line1 );
		var imgBorder = element( "div", {
			"className" : "personal-setting-box-img-border"
		}, line1 );
		var headImg = element( "img", {}, imgBorder );
		obj.img && (headImg.src = obj.img);
		var line2 = element( "div", {
			"className" : "personal-setting-box-line"
		}, box );
		var word2 = element( "div", {
			"className" : "personal-setting-box-word",
			innerHTML : "用户分享名称"
		}, line2 );
		var inputName = element( "input", {
			className : "personal-setting-input",
			type : "text"
		}, line2);
	    obj.username && (inputName.value = obj.username);
		var saveButton = element( "div", {
			className : "personal-setting-save-btn",
			innerHTML : '保存'
		}, box);
		var inputFile = element( "input", {
			type : "file",
			className : "hide",
            name:"headimg"
		}, line1 );
		var fileIcon = element( "div", {
			className : "personal-setting-file-icon"
		}, line1 );
		var imgSizeOver = element("span", {
		    className: "personal-setting-image-over-size-message"
		}, line1);

		closeButton.onclick = function () {
			document.body.removeChild( mask );
			document.body.removeChild( box );
		};

		fileIcon.onclick = function () {
		    if (obj.editenable && obj.editenable == true) {
		        inputFile.click();
		    }
		};

		inputFile.addEventListener("change", function () {
		    var file = this.files[0];
		    var KB = 1024;
		    if (file && file.size > 100 * KB) {
		        // 判断图片大小，如果超过100KB则提示图片过大
		        imgSizeOver.innerHTML = "图片不能超过100KB";
		    }
		    else {
		        imgSizeOver.innerHTML = "";
		        var reader = new FileReader();
		        reader.readAsDataURL(file);
		        reader.onload = function () {
		            headImg.src = this.result;
		        }
		    }
		}, false);
		if (obj.editenable&&obj.editenable==true) {
	        saveButton.onclick = function() {

	            // 用户分享名称不能为空
	            if ($.trim(inputName.value).length == 0 || $.trim(inputName.value) == "名称不能为空") {
	                inputName.value = "名称不能为空";
	                return;
	            }
	            // 注意保存成功后要执行
	            var author = inputName.value;

	            window.attachUpload({
	                mediaReceiveUrl: window.useSetting,
	                fileElement: inputFile,
	                postData: {
	                    author: author
	                },
	                acceptTypes: [".jpg", ".png", ".jpeg", ".bmp"],
	                inspector: {
	                    onStart: function() {

	                    },
	                    onError: function(err) {

	                    },
	                    onComplete: function(data) {

	                    }
	                },
	                maxValidSize: 1024 * 100
	            });

	            document.body.removeChild(mask);
	            document.body.removeChild(box);
	        }
	    } else {
		    saveButton.title = "您已设置过，无法在编辑！";
		}
	}
})();